<template v-cloak>
  <view class="cate-label">
    <view class="bar-sticky">
      <navigationBar
        :navigationBarStyle="navigationBarStyle"
        :showBack="false"
      ></navigationBar>
    </view>
<!--  -->
<view class="search">
<navigator url="../index/search/search">
		            <u-search
                shape="square"
                  height="60"
		              color="#8486f8"
		              :show-action="false"
		              placeholder="搜索文章"
		              :disabled="true"
		            ></u-search>

		          </navigator>
</view>


<view class="cate-container">
<view class="label-list">
<view class="title"
          ><image src="/static/icon/label.png" mode="widthFix"></image> 热门标签
        </view>
  	<view class='flex-a-wrap'>
			<view class="padding-xs" v-for="(item,index) in labelList" :key="index" @click="goLabel(item)">
				<view class='cu-tag sm light '>{{item.title}}</view>
			</view>
      	</view>
</view>
<view class="label-list">
<view class="title"
          ><image src="/static/icon/cate.png" mode="widthFix"></image> 文章分类
        </view>
  	<view class="list flex-wrap">
  	  <view class="item" v-for="(v,i) in cateList" :key="v.id"  @click="goCate(v)">
<view class="cover" :style="{ backgroundImage: 'url(' + v.cover + ')' }">
</view>
  	  </view>
  	</view>
</view>
</view>


<!--  -->
      <u-back-top
        :scrollTop="scrollTop"
        bottom="40"
        :custom-style="{ background: 'transparent' }"
      >
        <view class="back-top-image">
          <image src="/static/icon/icon-back-top.png" mode="widthFix"></image>
        </view>
      </u-back-top>
      <ALoading v-show="aloading"></ALoading>
      <view :class="{ mask: aloading }" :catchtouchmove="aloading"></view>
      <!-- <view class="no-more">
        <u-loadmore :status="status" font-size="24" :load-text="loadText" />
      </view> -->
      <u-no-network></u-no-network>
    </view>
  </view>
</template>

<script>
import navigationBar from "../../components/navigationBar/navigationBar.vue"
import ALoading from "../../components/loading/loading.vue"
export default {
  components: { navigationBar, ALoading },
  data() {
    return {
      navigationBarStyle: {
        background: "#8486f8",
        iconText: "发现", //导航栏文字
      },
      labelList: [],
      typeList:[],
      cateList:[],
      aloading: true,
      isGet: false,
      pages: 1, //页码
      pageSize: 5, //每页条数
      dataCount: 0, //总条数
      loadText: {
        loadmore: "轻轻上拉",
        loading: "努力加载中",
        nomore: "我也是有底线的",
      },
      scrollTop: 0,
      status:false
    }
  },
  onLoad() {
    // this.getTopicList()
    this.getLabelList()
    // this.getTypeList()
    this.getCateList()
  },
  onPullDownRefresh() {
    // this.getTopicList()
    this.getLabelList()
    // this.getTypeList()
    this.getCateList()
       uni.stopPullDownRefresh();
      },
  onPageScroll(e) {
    this.scrollTop = e.scrollTop
  },
  onReachBottom() {
    // 判断条件  页码 * 每页条数 < 总条数
    var isGet = (this.pages - 1) * this.pageSize < this.dataCount
    if (isGet) {
      // 触发数据加载
      this.getTopicList("nextpage")
    }
  },
  methods: {
    getLabelList() {
      let data = {
        status :1
      }
      this.$store.dispatch("label/list").then(res => {
        this.labelList = res.data
        this.aloading = false
      })
    },
    getCateList() {
      this.$store.dispatch("cate/list").then(res => {
        console.log(res,123)
        this.cateList = res.data
        this.aloading = false
      })
    },
    getTypeList() {
      let data = {
        status :1
      }
      this.$store.dispatch("type/list").then(res => {
        this.typeList = res.data
        this.aloading = false
      })
    },
goLabel(v){
  uni.navigateTo({
        url: "/pages/cate-label/label/label?id=" + v.id+'&title='+v.title
      })
},
goCate(v){
  uni.navigateTo({
          url: "/pages/cate-label/cate/cate?id=" + v.id+'&title='+v.title
        })
  },

    HandleView(id) {
      uni.navigateTo({
        url: "./detail/detail?id=" + id,
      })
    },
  },
}
</script>

<style lang="scss" scoped>

</style>
